<template>
	<view class="sampleorderlist">
		<view class="uni-container" style="width: 95%;margin-left: 10px; margin-top: 10px;">
			<!-- <el-table empty-text="暂无更多数据" ref="tables" border :data="card_arr" tooltip-effect="dark" style="width: 100%"
				@selection-change="handleSelectionChange" :row-key="rowKey">
				<el-table-column :reserve-selection="true" type="selection" align="center">
				</el-table-column>
				<el-table-column prop="material_code" align="center" label="物料编码"></el-table-column>
				<el-table-column fixed prop="material_name" align="center" label="物料名称"></el-table-column>
				<el-table-column prop="FBatchNo" align="center" label="批号"></el-table-column>
				<el-table-column prop="stock_code" align="center" label="仓库代码"></el-table-column>
				<el-table-column prop="stock_name" align="center" label="仓库名称"></el-table-column>
				<el-table-column prop="position_code" align="center" label="仓位代码"></el-table-column>
				<el-table-column prop="position_name" align="center" label="仓位名称"></el-table-column>
				<el-table-column prop="FKFDate" align="center" label="生产采购日期"></el-table-column>
				<el-table-column prop="FKFPeriod" align="center" label="保质期"></el-table-column>
				<el-table-column prop="jbdw_name" align="center" label="基本计量单位"></el-table-column>
				<el-table-column prop="FQty" align="center" label="基本单位数量"></el-table-column>
				<el-table-column prop="cydw_name" align="center" label="常用计量单位"></el-table-column>
				<el-table-column prop="FCUQty" align="center" label="常用单位数量"></el-table-column>
				<el-table-column prop="FSnListID" align="center" label="条形码"></el-table-column>
				<el-table-column prop="createtime" align="center" label="创建时间" :formatter='formatDate'>
				</el-table-column>
			</el-table> -->
		</view>
		<!-- stripe type="selection" 开启多选 -->
		<uni-table ref="table" :loading="loading" border emptyText="暂无更多数据"
			@selection-change="selectionChange">
			<uni-tr>
				<uni-th width="150" align="center">物料编码</uni-th>
				<uni-th width="150" align="center">物料名称</uni-th>
				<uni-th width="150" align="center">批号</uni-th>
				<uni-th width="204" align="center">仓库代码</uni-th>
				<uni-th width="150" align="center">仓库名称</uni-th>
				<uni-th width="150" align="center">生产采购日期</uni-th>
				<uni-th width="150" align="center">保质期</uni-th>
				<uni-th width="204" align="center">基本计量单位</uni-th>
				<uni-th width="150" align="center">基本单位数量</uni-th>
				<uni-th width="204" align="center">常用计量单位</uni-th>
				<uni-th width="150" align="center">常用单位数量</uni-th>
				<uni-th width="150" align="center">条形码</uni-th>
				<uni-th width="150" align="center">创建时间</uni-th>
			</uni-tr>
			<uni-tr v-for="(item, index) in card_arr" :key="index">
				<uni-td align="center">{{ item.material_code }}</uni-td>
				<uni-td align="center">{{ item.material_name }}</uni-td>
				<uni-td align="center">{{ item.FBatchNo }}</uni-td>
				<uni-td align="center">{{ item.stock_code }}</uni-td>
				<uni-td align="center">{{ item.stock_name }}</uni-td>
				<uni-td align="center">{{ item.FKFDate }}</uni-td>
				<uni-td align="center">{{ item.FKFPeriod }}</uni-td>
				<uni-td align="center">{{ item.jbdw_name }}</uni-td>
				<uni-td align="center">{{ item.FQty }}</uni-td>
				<uni-td align="center">{{ item.cydw_name }}</uni-td>
				<uni-td align="center">{{ item.FCUQty }}</uni-td>
				<uni-td align="center">{{ item.FSnListID }}</uni-td>
				<uni-td align="center">{{ item.createtime }}</uni-td>
				<!-- <uni-td>
					<view class="name">{{ item.name }}</view>
				</uni-td>
				<uni-td align="center">{{ item.address }}</uni-td>
				<uni-td>
					<view class="uni-group">
						<button class="uni-button" size="mini" type="primary">修改</button>
						<button class="uni-button" size="mini" type="warn">删除</button>
					</view>
				</uni-td> -->
			</uni-tr>
		</uni-table>
		<view class="uni-pagination-box"><uni-pagination show-icon :page-size="pageSize" :current="pageCurrent"
				:total="total" @change="change" /></view>
	</view>
</template>

<script>
// 引入uni-ui组件
import {
	uniPagination,
	uniIcons,
	uniCard,
	uniTable,
	uniTr,
	uniTh,
	uniTd,
} from "@dcloudio/uni-ui"

export default {
	data() {
		return {
			card_arr: [],
			currentPage: 1,
			totalPage: 0,
			// 每页数据量
			pageSize: 10,
			// 当前页
			pageCurrent: 1,
			// 数据总量
			total: 0,
			loading: false
		}
	},
	components: {
		uniPagination,
		uniIcons, //uni-ui的icons组件
		uniCard, //uni-ui的卡片组件
		uniTable,
		uniTr,
		uniTh,
		uniTd
	},
	methods: {
		rowKey: function (row) {
			return row.id
		},
		formatDate(row) {
			var date = new Date(row['createtime'] * 1000);
			return this.time(date)
		},
		time(date) {
			let Y = date.getFullYear() + '-';
			let M = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) + '-' : date.getMonth() + 1 + '-';
			let D = date.getDate() < 10 ? '0' + date.getDate() + ' ' : date.getDate() + ' ';
			let h = date.getHours() < 10 ? '0' + date.getHours() + ':' : date.getHours() + ':';
			let m = date.getMinutes() < 10 ? '0' + date.getMinutes() + ':' : date.getMinutes() + ':';
			let s = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds();
			return Y + M + D + h + m + s;
		},
		//获取列表
		getlist() {
			var type = 2
			this.$Api.getactuallist(this.currentPage, type).then(res => {
				console.log(res)
				if (res.data.code == 1) {
					var array = res.data.data.list
					if (this.currentPage == 1) {
						this.card_arr = array;
					} else {
						this.card_arr = this.card_arr.concat(array);
					}
					this.totalPage = res.data.data.total
					uni.stopPullDownRefresh()
				} else {
					this.card_arr = []
				}
			})
		},
	},

	mounted() {
		this.getlist()
	},
}
</script>

<style lang="less">
.sampleorderlist {
	// margin-top: 200rpx;
	padding: 0 20rpx;

	>.btn {
		display: inline-block;
		padding: 16rpx 20rpx;
		margin-top: 30rpx;
		margin-left: 10rpx;
		border-radius: 6rpx;
		font-size: 26rpx;
		color: #fff;

		>.uni-icons {
			//uni-ui的icon图标样式
			margin-right: 5rpx;
			font-weight: bolder;
		}
	}

	>.add {
		background: #18bc9c;

		&:active {
			background: #128F76;
		}
	}

	>.editor {
		background: #999;
	}

	>.delete {
		background: #F75444;

		&:active {
			background: #FA9086;
		}
	}

	>.card_list {
		padding: 0 10rpx;
		padding-top: 30rpx;

		>.uni-card {
			//uni-ui卡片组件的类名
			margin: 30rpx 10rpx !important;
			position: relative;

			.ul {
				>.li {
					display: flex;
					justify-content: space-between;
					align-items: center;
					padding: 10rpx 0;

					>.title {
						width: 98px;
					}

					>.value {
						min-height: 68rpx;
						width: 68%;
						padding-left: 20rpx;
						border: 1px solid #e5e5e5;
						border-radius: 4px;
						line-height: 68rpx;
						word-break: break-word;
						padding-right: 5px;
					}

					>.audit_status_1 {
						color: #18bc9c;
						font-weight: bold;
					}

					>.audit_status_2 {
						color: #aaa;
						font-weight: bold;
					}
				}
			}
		}

		>.empty {
			margin-top: 40rpx;
			color: #999;
			text-align: center;
			font-size: 36rpx;
		}
	}
}
</style>
